<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]>      <html class="no-js"> <!--<![endif]-->
<html>

<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>

	</title>
	<meta name="description" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link href="/stylesheets/output.css" rel="stylesheet">
</head>

<body>
	<!--[if lt IE 7]>
			<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="#">upgrade your browser</a> to improve your experience.</p>
		<![endif]-->
	<div class="w-4xl m-auto bg-amber-200 p-2.5 pt-6">
		<div class="bg-red-500 w-fit rounded-[4px] text-white p-1.5 ml-auto">
			<a href="/auth/logout">退出登录</a>
		</div>
		<h1 class="text-center text-3xl m-3">记账本</h1>
		<hr>
		</hr>
		<div class="w-full flex justify-end mt-[14px]">
			<a href="/account/create"
				class="bg-blue-500 inline-block underline-none rounded-[4px] text-white p-1.5 mr-6">添加账单</a>

		</div>
		<% accounts.forEach(item=>{ %>
			<div class="w-full h-fit rounded-xl my-3.5 bg-white">
				<div class="bg-pink-200 p-2">
					<span class="ml-2.5">
						<%= item.time %>
					</span>
				</div>
				<div class="flex justify-around items-center h-[50px] relative">
					<span class="">
						<%= item.title %>
					</span>
					<span class="inline-block <%= item.type===1?'bg-green-300':'bg-red-400' %>  p-1 text-white">
						<%= item.type===-1?'支出':'收入' %>
					</span>
					<span class="">
						<%= item.account %>元
					</span>
					<a href="/account/<%= item._id %>">
						<span
							class="text-shadow-indigo-200 text-2xl absolute right-4 top-3/6 -translate-y-3/6 active:text-blue-600">×</span>
					</a>
				</div>
			</div>
			<% }) %>



	</div>
</body>

</html>